<!--
 * @Author: cqg
 * @Date: 2020-12-14 11:13:36
 * @LastEditTime: 2020-12-18 11:00:17
 * @Description: file content
 * @LastEditors: cqg
-->
<template>
  <div class="card-box">
    <el-tabs tab-position="left">
      <el-tab-pane label="总包合同">
        <el-form :model="form" class="form-wrap" size="small">
          <p class="title full">总包合同信息</p>
          <el-form-item label="合同编号" prop="contractNum">
            <el-input disabled v-model="form.contractNum" maxlength="50" placeholder="请输入合同编号" />
          </el-form-item>
          <el-form-item label="合同类型" prop="contractType">
            <el-select disabled v-model="form.contractType" placeholder="请选择合同类型">
              <el-option v-for="item in epcContractTypes" :key="item.label" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="合同金额(元)" prop="contractAmount">
            <el-input disabled v-model="form.contractAmount" maxlength="18" placeholder="请输入合同金额" />
          </el-form-item>
          <el-form-item label="单价(元/m²)" prop="unitPrice">
            <el-input disabled v-model="form.unitPrice" maxlength="18" placeholder="请输入单价" />
          </el-form-item>
          <el-form-item label="签订日期" prop="contractDate">
            <el-date-picker disabled v-model="form.contractDate" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="请选择签订日期" />
          </el-form-item>
          <el-form-item label="合同开始日期" prop="startDate">
            <el-date-picker disabled v-model="form.startDate" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="请选择合同开始日期" />
          </el-form-item>
          <el-form-item label="合同结束日期" prop="endDate">
            <el-date-picker disabled v-model="form.endDate" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="请选择合同结束日期" />
          </el-form-item>
          <el-form-item label="乙方单位名称" prop="partybUnit">
            <el-input disabled v-model="form.partybUnit" maxlength="100" placeholder="请输入乙方单位名称" />
          </el-form-item>
          <el-form-item label="联系人" prop="partybContact">
            <el-input disabled v-model="form.partybContact" maxlength="100" placeholder="请输入联系人" />
          </el-form-item>
          <el-form-item label="联系电话" prop="partybPhone">
            <el-input disabled v-model="form.partybPhone" maxlength="100" placeholder="请输入联系电话" />
          </el-form-item>
          <el-form-item label="是否有补充协议" prop="supplement">
            <el-select disabled v-model="form.supplement" placeholder="请选择合同类型">
              <el-option v-for="item in supplements" :key="item.label" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="补充协议签订日期" prop="signDate" v-if="form.supplement === '1'">
            <el-date-picker disabled v-model="form.signDate" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="请选择合同结束日期" />
          </el-form-item>
          <el-form-item label="补充协议期限" prop="suppleStart" v-if="form.supplement === '1'">
            <el-date-picker
              type="daterange"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              disabled
              v-model="form.suppleStart"
              format="yyyy-MM-dd"
              valueFormat="yyyy-MM-dd"
            />
          </el-form-item>
          <el-form-item label="补充协议金额(元)" prop="suppleAmount" v-if="form.supplement === '1'">
            <el-input disabled v-model="form.suppleAmount" maxlength="18" placeholder="请输入补充协议金额" />
          </el-form-item>
          <el-form-item label="备注" class="full" prop="remarks">
            <el-input disabled v-model="form.remarks" maxlength="200" placeholder="请输入" />
          </el-form-item>
        </el-form>
        <p class="title full" v-if="form.supplement === '1'">补充协议</p>
        <v-upload
          ref="supplementaryUpload"
          class="full"
          v-if="form.supplement === '1'"
          :busId="form.projectContractId"
          modelType="supplementary"
          isShowFileList
          @loadCompleted="supplementaryLoadCompleted"
          :isView="true"
          multiple
          v-model="supplementaryFileList"
        />
        <p class="title full">附件</p>
        <v-upload
          class="full"
          ref="normalUpload"
          @loadCompleted="normalLoadCompleted"
          :busId="form.projectContractId"
          modelType="normal"
          isShowFileList
          :isView="true"
          multiple
          v-model="uploadFileList"
        />
      </el-tab-pane>
      <el-tab-pane
        v-for="(subForm,index) in form.epcProjectSubContracts"
        :key="index"
        :label="subContractTypes(subForm.subContracts.contractType).label"
        :value="subForm.subContracts.contractType"
      >
        <p class="title full">{{subContractTypes(subForm.subContracts.contractType).label}}信息</p>
        <el-form :model="subForm.subContracts" class="form-wrap" size="small">
          <el-form-item label="合同编号" prop="contractNum">
            <el-input v-model="subForm.subContracts.contractNum" maxlength="50" placeholder="请输入合同编号" />
          </el-form-item>
          <el-form-item label="合同类型" prop="contractType">
            <el-select v-model="subForm.subContracts.contractType" placeholder="请选择合同类型">
              <el-option v-for="item in epcContractTypes" :key="item.label" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="合同金额(元)" prop="contractAmount">
            <el-input v-model="subForm.subContracts.contractAmount" maxlength="18" placeholder="请输入合同金额" />
          </el-form-item>
          <el-form-item label="单价(元/m²)" prop="unitPrice">
            <el-input v-model="subForm.subContracts.unitPrice" maxlength="50" placeholder="请输入单价" />
          </el-form-item>
          <el-form-item label="签订日期" prop="contractDate">
            <el-date-picker v-model="subForm.subContracts.contractDate" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="请选择签订日期" />
          </el-form-item>
          <el-form-item label="合同开始日期" prop="startDate">
            <el-date-picker v-model="subForm.subContracts.startDate" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="请选择合同开始日期" />
          </el-form-item>
          <el-form-item label="合同结束日期" prop="endDate">
            <el-date-picker v-model="subForm.subContracts.endDate" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="请选择合同结束日期" />
          </el-form-item>
          <el-form-item label="乙方单位名称" prop="partybUnit">
            <el-input v-model="subForm.subContracts.partybUnit" maxlength="100" placeholder="请输入乙方单位名称" />
          </el-form-item>
          <el-form-item label="联系人" prop="partybContact">
            <el-input v-model="subForm.subContracts.partybContact" maxlength="50" placeholder="请输入联系人" />
          </el-form-item>
          <el-form-item label="联系电话" prop="partybPhone">
            <el-input v-model="subForm.subContracts.partybPhone" maxlength="100" placeholder="请输入联系电话" />
          </el-form-item>
          <el-form-item label="是否有补充协议" prop="supplement">
            <el-select v-model="subForm.subContracts.supplement" placeholder="请选择合同类型">
              <el-option v-for="item in supplements" :key="item.label" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="补充协议签订日期" prop="signDate" v-if="subForm.subContracts.supplement === '1'">
            <el-date-picker v-model="subForm.subContracts.signDate" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="请选择合同结束日期" />
          </el-form-item>
          <el-form-item label="补充协议期限" prop="suppleStart" v-if="subForm.subContracts.supplement === '1'">
            <el-date-picker
              type="daterange"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              v-model="subForm.subContracts.suppleStart"
              format="yyyy-MM-dd"
              valueFormat="yyyy-MM-dd"
            />
          </el-form-item>
          <el-form-item label="补充协议金额(元)" prop="suppleAmount" v-if="subForm.subContracts.supplement === '1'">
            <el-input v-model="subForm.subContracts.suppleAmount" maxlength="18" placeholder="请输入补充协议金额" />
          </el-form-item>
          <p class="title full">其他费用</p>
          <el-table :data="subForm.otherExpenses" align="center" class="full">
            <el-table-column prop="expensesName" label="费用项目名称" width="120" />
            <el-table-column prop="amount" label="金额（元）" width="120" />
            <el-table-column prop="remarks" label="备注" width="120" />
          </el-table>
          <p class="title full">备注</p>
          <el-form-item class="full" prop="remarks">
            <span class="int-text">{{subForm.subContracts.remarks}}</span>
          </el-form-item>
        </el-form>
        <div class="card-box" v-if="subForm.subContracts.supplement === '1'">
          <p class="title full">补充协议</p>
          <v-upload
            ref="otherUpload"
            :busId="subForm.subContracts.projectSubContractId"
            modelType="otherSupplements"
            @loadCompleted="otherLoadCompleted"
            isShowFileList
            :isView="true"
            multiple
            v-model="otherFileList"
          />
        </div>
        <p class="title full">附件</p>
        <v-upload
          ref="fileUpload"
          :busId="subForm.subContracts.projectSubContractId"
          modelType="supplements"
          @loadCompleted="loadCompleted"
          isShowFileList
          :isView="true"
          multiple
          v-model="fileList"
        />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import { getDict } from "@/utils";
import OverviewMixins from '../public/overviewMixins'

export default {
  mixins: [OverviewMixins],
  props: ['form'],
  data () {
    return {
      supplementaryFileList: [],
      uploadFileList: [],
      otherFileList: [],
      fileList: [],
      supplements: [
        {
          value: '1',
          label: '是'
        },
        {
          value: '0',
          label: '否'
        }
      ],
    }
  },
  methods: {
    // 子合同名称
    subContractTypes (v) {
      return getDict("epc_contract_type").find(i => v == i.value)
    },
    //补充协议附件回显过滤
    supplementaryLoadCompleted (data) {
      this.$refs.supplementaryUpload.loadFileList = data.filter(item => item.module === 'supplementary')
    },
    //附件回显过滤
    normalLoadCompleted (data) {
      this.$refs.normalUpload.loadFileList = data.filter(item => item.module === 'normal')
    },
    //补充协议附件回显过滤
    otherLoadCompleted (data) {
      this.$refs.otherUpload.loadFileList = data.filter(item => item.module === 'otherSupplements')
    },
    //附件回显过滤
    loadCompleted (data) {
      this.$refs.fileUpload.loadFileList = data.filter(item => item.module === 'supplements')
    },
  }

}
</script>
